<template>
	<view class="apply bg-page" :style="'min-height:'+$xyfun.xysys().windowHeight+'px'">
		<view class="user-list lh-70 flex p-lr-30 p-tb-25 m-b-2 bg-w" @tap="$xyfun.to('/pages/user/account/list')">
			<text class="list-name">{{withdrawInfo.account?'提现到':'请添加提现账户'}}</text>
			<view class="flex m-l-auto">
				<view v-if="withdrawInfo.account">
					<text class="m-r-15" :class="'xyicon icon-'+withdrawInfo.account.type"></text>
					{{withdrawInfo.account.account_no}}
				</view>
				<text class="xyicon icon-right m-l-15"></text>
			</view>
		</view>
		<view class="user-list p-lr-30 p-tb-25 m-b-2 bg-w">
			<view class="list-name">提现金额：</view>
			<view class="flex ts-42 tb m-t-25 ali-cen">
				<text class="lh-42">¥</text>
				<input class="h-42 lh-42 m-l-20 ts-40" type="number" v-model="applyMoney" />
			</view>
		</view>
		<view class="user-list p-lr-30 lh-30 p-tb-25 m-b-2 ts-26 bg-w">
			<view>可提现: ￥{{withdrawInfo.able}} <text class="ts-28 m-l-30 tm2" @tap="allMoney()">全部提现</text></view>
			<view class="m-tb-15">最小提现金额为￥{{withdrawInfo.min}}，最大提现金额为￥{{withdrawInfo.max}}</view>
			<view>提现手续费为{{withdrawInfo.rate}}%</view>
		</view>
		<view class="m-50" >
			<button class="ts-30 lh-30 p-25 tc-w m-t-50 tm1b" @tap="apply()">提现</button>
		</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex';
	export default {
		
		data() {
			return {

				disabled:false,
				store_id:0,
				type:'',//提现类型 distribution=分销 coach=教练
				withdrawInfo:{
					able:0.00, //可提现金额
					min:0.00, //最小提现金额
					max:0.00, //最大提现金额
					rate:0, //手续费比例
					account:null, //提现账号
				},
				applyMoney:'',//提现申请金额
			}
		},
		computed: {
			...mapState(['common'])
		},
		async onLoad(options) {
			this.type = options.type ? options.type : '';
			this.store_id = options.store_id ? options.store_id : 0,


			this.loadData();
		},
		
		methods: {
			
			async loadData(){
				this.$api.post({
					url: '/user_withdraw/init',
					loadingTip:'加载中...',
					data: {
						type:this.type,
						store_id:this.store_id,
					},
					success: res => {
						if(res.status == 'normal'){
							this.withdrawInfo = res.data;
						}else{
							this.$xyfun.back(res.msg);
						}
					}
				});
			},
			
			// 全部提现
			allMoney() {
				this.applyMoney = this.withdrawInfo.able;
			},
			
			// 提交申请
			apply() {
				
				if(this.disabled){
					return false;
				}
				
				if (this.withdrawInfo.account == null) {
					this.$xyfun.msg('请添加提现账户');
					return false;
				}
				
				if (this.applyMoney == '') {
					this.$xyfun.msg('请输入提现金额');
					return false;
				}
				
				
				if(this.applyMoney > parseFloat(this.withdrawInfo.able)){
					this.$xyfun.msg('提现金额超出可提现金额');
					return false;
				}
				
				if(this.applyMoney < parseFloat(this.withdrawInfo.min)){
					this.$xyfun.msg('最小提现金额为'+this.withdrawInfo.min);
					return false;
				}
				
				if(this.applyMoney > parseFloat(this.withdrawInfo.max)){
					this.$xyfun.msg('最大提现金额为'+this.withdrawInfo.max);
					return false;
				}
				
				this.disabled = true;
				this.$api.post({
					url: '/user_withdraw/add',
					loadingTip:'提交中...',
					data: {
						type:this.type,
						store_id:this.store_id,
						apply_money:this.applyMoney,
						realname:this.withdrawInfo.account.realname,
						mobile:this.withdrawInfo.account.mobile,
						account_type:this.withdrawInfo.account.type,
						account_name:this.withdrawInfo.account.account_name,
						account_no:this.withdrawInfo.account.account_no
					},
					success: () => {
						this.$xyfun.prePage().reLoadData();
						this.$xyfun.back('申请成功');
					},
					fail(){
						this.disabled = false;
					}
				});
				
			},
		}
	}
</script>

<style scoped lang="scss">
	.user-list {
		input{width: 90%;}
	}
</style>
